import React, { Component, useMemo, useState } from "react";
import { View, Image, Text, Button } from "@tarojs/components";
import Taro from "@tarojs/taro";

import styles from "./index.module.scss";
import MiniHeader from "@/components/UI/MiniHeader";
let evaluationList = [
  {
    title: "SDS兴趣倾向测评",
    subTitle: "热爱指引我们前行",
    img: require("./imgs/xingqu-test@2x.png").default,
    type: "xingqu",
  },
  {
    title: "MIDAS能力倾向测评",
    subTitle: "幸福在于能力完全运用",
    img: require("./imgs/nengli-test@2x.png").default,
    type: "nengli",
  },
  {
    title: "ASO学科倾向测评",
    subTitle: "选择大于努力",
    img: require("./imgs/xueke-test@2x.png").default,
    type: "xueke",
  },
  {
    title: "MBTI性格倾向测评",
    subTitle: "发现不一样的你",
    img: require("./imgs/xingge-test@2x.png").default,
    type: "xingge",
  },
  {
    title: "LVI价值观倾向测评",
    subTitle: "世界是你的投射",
    img: require("./imgs/jiazhiguan-test@2x.png").default,
    type: "jianzhi",
  },
  {
    title: "不知道的",
    subTitle: "热爱指引我们前行",
    img: require("./imgs/xingqu-test@2x.png").default,
    type: "nkown",
  },
];

export default function() {
  return (
    <View className={styles.page}>
      <MiniHeader title="测评系统" transparent={false} hideHome></MiniHeader>
      <View className={styles.list}>
        {evaluationList.map(item => {
          return (
            <View
              className={styles.item}
              key={item.title}
              onClick={() => {
                Taro.navigateTo({
                  url: "/pages/evaluation-test/evaluation-test?id=" + item.type,
                });
              }}
            >
              <Image className={styles.img} src={item.img}></Image>
              <View className={styles.textWrap}>
                <View className={styles.title}>{item.title}</View>
                <View className={styles.subTitle}>{item.subTitle}</View>
              </View>
            </View>
          );
        })}
      </View>
    </View>
  );
}
